import { ref } from 'vue'
import { defineStore } from 'pinia'
import {
  getCategory,
  type CategoryResponse,
} from '@/apis/getCategory.ts'

// 👇【关键】缓存版本号 —— 每次导航结构或数据格式变更时 +1
const CACHE_V = '1'
const CACHE_KEY = `navList_v${CACHE_V}`

export const useNavListStore = defineStore(
  'navList',
  () => {
    // 初始化时尝试从 localStorage 读取缓存
    const navList = ref<string[]>(
      JSON.parse(localStorage.getItem(CACHE_KEY) || '[]'),
    )

    const getNavList = async () => {
      // 如果已有数据（来自缓存或之前加载），不再请求
      if (navList.value.length > 0) {
        return
      }

      try {
        const res: CategoryResponse = await getCategory()
        const result = res.result

        const data = result.map((item) => item.name)
        navList.value = data

        // 保存到 localStorage（带当前版本）
        localStorage.setItem(
          CACHE_KEY,
          JSON.stringify(data),
        )
      } catch (error) {
        console.error(
          'Failed to fetch navigation list:',
          error,
        )
        // 可选：设置错误状态，或兜底数据
      }
    }

    return {
      navList,
      getNavList,
    }
  },
)
